<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<head>
    <title>校企合作信息平台</title>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

    <link rel="stylesheet" th:href="@{/login/bootstrap.min.css}"/>
    <link rel="stylesheet" th:href="@{/login/css/camera.css}"/>
    <link rel="stylesheet" th:href="@{/login/bootstrap-responsive.min.css}"/>
    <link rel="stylesheet" th:href="@{/login/matrix-login.css}"/>
    <link th:href="@{/login/font-awesome.css}" rel="stylesheet"/>
    <style type="text/css">
        /*
       body{
        -webkit-transform: rotate(-3deg);
        -moz-transform: rotate(-3deg);
        -o-transform: rotate(-3deg);
        padding-top:20px;
        }
        */
        .cavs {
            z-index: 1;
            position: fixed;
            width: 95%;
            margin-left: 20px;
            margin-right: 20px;
        }
    </style>
    <script>
        //window.setTimeout(showfh,3000);
        var timer;

        function showfh() {
            fhi = 1;
            //关闭提示晃动屏幕，注释掉这句话即可
            timer = setInterval(xzfh2, 10);
        };
        var current = 0;

        function xzfh() {
            current = (current) % 360;
            document.body.style.transform = 'rotate(' + current + 'deg)';
            current++;
            if (current > 360) {
                current = 0;
            }
        };
        var fhi = 1;
        var current2 = 1;

        function xzfh2() {
            if (fhi > 50) {
                document.body.style.transform = 'rotate(0deg)';
                clearInterval(timer);
                return;
            }
            current = (current2) % 360;
            document.body.style.transform = 'rotate(' + current + 'deg)';
            current++;
            if (current2 == 1) {
                current2 = -1;
            } else {
                current2 = 1;
            }
            fhi++;
        };
    </script>

</head>
<body>
<script th:src="@{/js/jquery-2.1.1.min.js}"></script>
<script th:src="@{/js/layer/layer.js}"></script>
<canvas class="cavs"></canvas>
<div style="width:100%;text-align: center;margin: 0 auto;position: absolute;">
    <!-- 登录 -->
        <div id="loginbox">
            <form method="post" id="modularForm">
                <div class="control-group normal_text">
                    <h2 style="padding-top: 3%">
                        <!--<img th:src="@{/login/logo9.png}" alt="Logo"/>-->
                        校企合作信息平台
                    </h2>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <div class="main_input_box">
							<span class="add-on bg_lg">
							<i><img height="37" th:src="@{/login/user.png}"/></i>
							</span><input type="text" name="loginname" id="loginname" value="" placeholder="请输入用户名"/>
                        </div>
                    </div>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <div class="main_input_box">
							<span class="add-on bg_ly">
							<i><img height="37" th:src="@{/login/suo.png}"/></i>
							</span><input type="password" name="password" id="password" placeholder="请输入密码"
                                          class="keypad" keypadMode="full" allowKeyboard="true" value=""/>
                        </div>
                    </div>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <button id="submitBtn" type="button" class="btn btn-success" style="width:89%;" onclick="checks()">登录</button>
                    </div>
                </div>
            </form>
            <div class="controls">
                <div class="main_input_box">
                    <font color="white"><span id="nameerr">   @2018 天津中德应用技术大学 软件与通信学院 </span></font>
                </div>
            </div>
        </div>

</div>
<div id="templatemo_banner_slide" class="container_wapper">
    <div class="camera_wrap camera_emboss" id="camera_slide">
        <!-- 背景图片 -->
        <div th:data-src="@{/img/web_login_bg.jpg}"></div>
        <!--<div th:data-src="@{/login/images/banner_slide_01.jpg}"></div>-->
        <!--<div th:data-src="@{/login/images/banner_slide_02.jpg}"></div>-->
        <!--<div th:data-src="@{/login/images/banner_slide_03.jpg}"></div>-->
        <div th:data-src="@{/login/images/banner_slide_04.jpg}"></div>
        <div th:data-src="@{/login/images/banner_slide_05.jpg}"></div>

    </div>
</div>

<script type="text/javascript">
        var explorer = window.navigator.userAgent ;
        if (explorer.indexOf("Firefox") >= 0||explorer.indexOf("Chrome") >= 0) {
        }else{
            alert("请使用谷歌浏览器或者火狐浏览器");
        }
        //提交
        function checks(){
            if(check()){
                var name = $("#loginname").val();
                var password = $("#password").val();
                $.ajax({
                    type: "POST",
                    url: 'login',
                    data: {"name":name,"password":password},
                    dataType:'json',
                    cache: false,
                    success: function(data){
                        if(data){
                            $("#loginbox").tips({
                                side : 1,
                                msg : '验证完成 , 正在登陆...',
                                bg : '#68B500',
                                time : 3
                            });
                            layer.msg("登录成功");
                            setTimeout(function () {
                                window.location = ("../infoManage/indexTotal")
                            },1500);
                        }
                        else{
                            $("#loginbox").tips({
                                side : 1,
                                msg : '验证完成 , 账号或密码错误...',
                                bg : '#B50B0C',
                                time : 3
                            });
                            layer.msg("用户名或密码错误");
                            $("#loginname").val("");
                            $("#password").val("");

                        }
                    }
                });
            }
        }
        //客户端校验
        function check() {

            if ($("#loginname").val() == "") {
                $("#loginname").tips({
                    side : 2,
                    msg : '用户名不得为空',
                    bg : '#AE81FF',
                    time : 3
                });
                showfh();
                $("#loginname").focus();
                return false;
            } else {
                $("#loginname").val(jQuery.trim($('#loginname').val()));
            }
            if ($("#password").val() == "") {
                $("#password").tips({
                    side : 2,
                    msg : '密码不得为空',
                    bg : '#AE81FF',
                    time : 3
                });
                showfh();
                $("#password").focus();
                return false;
            }
            if ($("#code").val() == "") {
                $("#code").tips({
                    side : 1,
                    msg : '验证码不得为空',
                    bg : '#AE81FF',
                    time : 3
                });
                showfh();
                $("#code").focus();
                return false;
            }
            $("#loginbox").tips({
                side : 1,
                msg : '正在验证 , 请稍后 ...',
                bg : '#68B500',
                time : 3
            });

            return true;
        }


</script>
<!--<script th:src="@{/login/js/bootstrap.min.js}"></script>-->
<script th:src="@{/login/js/jquery-1.7.2.js}"></script>
<script th:src="@{/login/js/jquery.easing.1.3.js}"></script>
<script th:src="@{/login/js/jquery.mobile.customized.min.js}"></script>
<script th:src="@{/login/js/camera.min.js}"></script>
<script th:src="@{/login/js/templatemo_script.js}"></script>
<script th:src="@{/login/js/ban.js}"></script>
<!--提示-->
<script type="text/javascript" th:src="@{/login/js/jquery.tips.js}"></script>

</body>

</html>